<template>
    <div>
        <van-nav-bar title="VIVO" left-text="返回" left-arrow @click-left="onClickLeft" />

        <van-tabs v-model:active="active">
            <van-tab title="官方正品">
                <van-swipe :autoplay="3000" lazy-render>
                    <van-swipe-item v-for="image in images" :key="image">
                        <img :src="image" style="width: 100%; height: 200px;" />
                    </van-swipe-item>
                </van-swipe>

                <van-grid>
                    <van-grid-item icon="photo-o" text="手机" />
                    <van-grid-item icon="photo-o" text="充电" />
                    <van-grid-item icon="photo-o" text="音乐" />
                    <van-grid-item icon="photo-o" text="全部分类" />
                    <van-grid-item icon="photo-o" text="秒杀" />
                    <van-grid-item icon="photo-o" text="以旧换新" />
                    <van-grid-item icon="photo-o" text="免费定制" />
                    <van-grid-item icon="photo-o" text="碎屏宝" />
                </van-grid>
                <img src="../../images/image.png" alt="" style="width: 100%; ">
            </van-tab>
            <van-tab title="极速物流">

                <van-grid :border="false" :column-num="2">
                    <van-grid-item v-for="item in searchApiData">
                        <van-image :src="item.goods_big_logo?item.goods_big_logo:'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg'" />
                        <h5>{{ item.goods_name}}</h5>
                    </van-grid-item>
                </van-grid>

            </van-tab>
            <van-tab title="全国联保">全国联保</van-tab>
            <van-tab title="免费定制">免费定制</van-tab>
        </van-tabs>
    </div>
</template>

<script setup>
import { ref } from 'vue';
const images = [
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg',
];

import { searchApi } from '@/api/api'
import { useRoute } from 'vue-router';
const route = useRoute()
const searchApiData =ref([])
searchApi(route.query).then(res => {
    console.log('数据', res);
searchApiData.value=res.data.message.goods
})
</script>

<style lang="scss" scoped></style>